// components/test2/test2.js
Component({
  /**
   * 组件的属性列表
   */
  properties: {

  },
  // 定义纯数据字段
  options: {
    // 我们定义以_开头的都是纯数据字段
    pureDataPattern: /^_/
  },
  /**
   * 组件的初始数据
   */
  data: {
    // 纯数据字段
    _rgb: {
      r: 0,
      g: 0,
      b: 0
    },
    fullColor: '0,0,0'
  },
  observers: {
    // '_rgb.r,_rgb.g,_rgb.b':function (r,g,b) {
    //   this.setData({
    //     fullColor:`${r},${g},${b}`
    //   })
    // ** 属性统配符监听所有属性
    '_rgb.**': function (obj) {
      this.setData({
        fullColor: `${obj.r},${obj.g},${obj.b}`
      })

    }

  },
  /**
   * 组件的方法列表
   */
  methods: {
    changR() {
      this.setData({
        //  给对象中的属性修改值
        '_rgb.r': this.data._rgb.r + 5 >= 255 ? 255 : this.data._rgb.r + 5
      })
      console.log(this.data._rgb);
    },
    changG() {
      this.setData({
        '_rgb.g': this.data._rgb.g + 5 >= 255 ? 255 : this.data._rgb.g + 5
      })
      console.log(this.data._rgb);

    },
    changB() {
      this.setData({
        '_rgb.b': this.data._rgb.b + 5 >= 255 ? 255 : this.data._rgb.b + 5
      })
      console.log(this.data._rgb);

    },
    // 生成随机颜色
    _randomColor() {
      this.setData({
        _rgb: {
          r: Math.floor(Math.random() * 256),
          g: Math.floor(Math.random() * 256),
          b: Math.floor(Math.random() * 256),
        }
      })
    }
  },
  // 组件自己的生命周期 
  lifetimes: {
    created() {
      console.log('created');
    },
    attached() {
      console.log('attached');
    }

  },
  // 组件所在页面的生命周期
  pageLifetimes: {
    show: function () {
      console.log('show');
      // 生成随机颜色
      this._randomColor()
    },
    hide: function () {
      console.log('hide');
    },
    resize: function () {
      console.log('resize');
    }
  }
})